
<!DOCTYPE html> 
<html > 

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=0"> 
	<title>Multi-page template</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="jquery.mobile.structure-1.0.1.css" />
	<link rel="apple-touch-icon" href="images/launch_icon_57.png" />
	<link rel="apple-touch-icon" sizes="72x72" href="images/launch_icon_72.png" />
	<link rel="apple-touch-icon" sizes="114x114" href="images/launch_icon_114.png" />
		<link rel="stylesheet" href="jquery.mobile-1.0.1.css" />
	<link rel="stylesheet" href="custom.css" />

	<link rel="stylesheet" href="css/vertical_silder.css" />
	
	<script src="js/jquery-1.7.1.min.js"></script>
	<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
	<script src="js/jquery.mobile-1.0.1.min.js"></script>
	<script src="js/vertical-slider.jquery.js"></script>
	
	
	<style>
  #ex1_container { text-align:center }
</style>

</head> 

	
<body> 

<!-- Start of first page: #one -->

<div id="choisir_ville" data-role="page" data-add-back-btn="true">
	
	<div data-role="header"> 
		<h1> Restaurant Picker</h1>
	</div> 
	<div data-role="content" >	
			<div  class="y " id="ex1_container" style="background-image: url(images/thermometer.png); height: 600px; width: 320px; border: 1px solid black;">
					<h3 >Temperatura:</h3>
					
					<input type="range" name="slider" id="slider-0" value="50" step="5" min="0" max="100"  sliderOrientation="vertical" />
					
			</div>
			               <p align="center">
                  <input type='button' onClick='btnSave(0)' value='Guardar'> 
                  </p>
		
	</div><!-- /content -->
	

</div><!-- /page one -->

</body>
</html>
